<template>
<view class="container font_08"> 
  <view class="orderSateContainer ">
    <view class="oooo ">
      <image mode="aspectFill" src="https://image1.sansancloud.com/xianhua/2020_4/8/10/45/30_55.jpg?x-oss-process=style/preview_120"></image>
      <view class="oooo_view"> 
        <text class="font5">订单号: {{orderDetailData.orderNo}}</text>
        <text>订单金额: ￥{{orderDetailData.goodsAmount}}</text>
        <text>运费:￥ {{orderDetailData.yunfeiAmount}}</text>
        <text>{{orderDetailData.payTypeStr}}: ￥{{orderDetailData.payAmount}}</text>
        <block v-if="orderDetailData.payStatus == 0"> <text>支付状态: 未支付</text>  </block>
          <block v-if="orderDetailData.payStatus == 1"> <text>支付状态: 已支付</text>  </block>
          <block v-if="orderDetailData.payStatus == 2"> <text>支付状态: 已退款</text>  </block>

      </view>
    </view> 
  
    <block v-if="orderDetailData.easyStatusStr == '作废'"> 
          <text :style="'color:' + setting.platformSetting.defaultColor">已作废</text>
        </block>
        <block v-else-if="orderDetailData.easyStatusStr == '完成'"> 
          <text :style="'color:' + setting.platformSetting.defaultColor">交易成功</text>
        </block>
        <block v-else-if="orderDetailData.easyStatusStr == '待评价'"> 
          <text :style="'color:' + setting.platformSetting.defaultColor">待完成</text>
        </block>
        <block v-else>
           <text :style="'color:' + setting.platformSetting.defaultColor">{{orderDetailData.easyStatusStr}}</text>
        </block>
  </view>
  <view class="orderKuaidi" v-if="orderDetailData.orderStatus > 3 && orderDetailData.orderStatus < 7">
      <view> 
         <text>快递名：</text> 
         <text :style="'color:' + setting.platformSetting.defaultColor">{{orderDetailData.kuaidiName}}</text> 
      </view>
      <view class="orderKuaidi_no">
        <text>快递单号：</text> 
        <text selectable="true" :style="'color:' + setting.platformSetting.defaultColor">{{orderDetailData.invoiceNo}}</text>
        <text v-if="orderDetailData.invoiceNo" style="padding:0 0.4em;border-radius:0.4em;color:#e24148; border:2rpx solid #e24148; margin-left:0.6em;" @tap="copyTBL">复制</text>
        <text v-else style="padding:0 0.4em;border-radius:0.4em;color:#e24148; border:2rpx solid #e24148; margin-left:0.6em;"></text>
      </view>
  </view>
  <view class="addrItems2">
      <image mode="aspectFill" src="https://image1.sansancloud.com/xianhua/2019_12/12/13/49/30_402.jpg?x-oss-process=style/preview_120"></image>
      <view class="addrInfo">
        <view>
          <text>{{orderDetailData.buyerName}}</text>
          <text class="marginleft">{{orderDetailData.buyerTelno}}</text>
        </view>
        <text class="font2">{{orderDetailData.buyerProvince}} {{orderDetailData.buyerCity}} {{orderDetailData.buyerArea}} {{orderDetailData.buyerAddress}}</text>
      </view>
  </view>
  <view class="server_container">
     <view>{{orderDetailData.storageName}}</view>
  </view>
  <view class="cartContainer">
    <view class="cartShopName">
       <view class="font1">
         <text>{{orderDetailData.belongShopName}}</text>
         <text v-if="orderDetailData.promotionName" class="marginleft vity_tag">{{orderDetailData.promotionName}}</text> 
      </view>
      <text class="color" :style="'color:' + setting.platformSetting.defaultColor">合计:￥ {{orderDetailData.goodsAmount}}</text>
    </view>
    <view class="cartItems" v-for="(orderItem, index) in orderDetailData.orderItems" :key="index">
      <view class="itemCheckbox">
        <image mode="aspectFill" :src="orderItem.itemIcon + '?x-oss-process=style/preview'"></image>
      </view>
      <view class="item_infomation">
        <view class="item_infomation_name">{{orderItem.itemName}}</view>
        <view class="item_infomation_name_measure" v-if="!!orderItem.measureCartesianId">{{orderItem.measures}}</view>
        <view class="item_infomation_nums"> 
          <text class="flexCenter">x {{orderItem.itemCount}}</text>
        </view>
        <view class="item_infomation_money" :style="'color:' + setting.platformSetting.defaultColor">单价:￥ {{orderItem.itemPrice}}</view>
      </view>
    </view>
    <!-- <view class='butn_container2'>
      <text>留言</text>
      <text class='Input'>{{orderDetailData.buyerScript}}</text>
    </view> -->
  </view>

  <view class="orderTime">
    <text>订单生成时间: {{orderDetailData.addTime}}</text>
    <text>订单支付时间: {{orderDetailData.payTime}}</text>
    <text>订单送货时间: {{orderDetailData.receiveTime}}</text>
  </view>
   <view class="orderTime2">
      <view class="wuliuItem" v-for="(item, index) in orderDetailData.kuaidiBean.data" :key="index">
        <view style="color:#333;">{{item.context}}</view>
        <view class="time">{{item.time}} </view>
      </view>
    </view> 
</view>
</template>

<script>

export default {
  data() {
    return {
      setting: null,
      loginUser: null,
      orderNo: null,
      orderDetailData: null
    };
  },

  components: {},
  props: {},

  /**
   * 生命周期函数--监听页面加载
   */
  onLoad: function (option) {
    var that = this;
    this.setData({
      setting: getApp().globalData.setting,
      loginUser: getApp().globalData.loginUser
    });
    console.log(option);
    that.getOrderDetail(option.orderNo);
  },

  /**
   * 生命周期函数--监听页面初次渲染完成
   */
  onReady: function () {},

  /**
   * 生命周期函数--监听页面显示
   */
  onShow: function () {},

  /**
   * 生命周期函数--监听页面隐藏
   */
  onHide: function () {},

  /**
   * 生命周期函数--监听页面卸载
   */
  onUnload: function () {},

  /**
   * 页面相关事件处理函数--监听用户下拉动作
   */
  onPullDownRefresh: function () {},

  /**
   * 页面上拉触底事件的处理函数
   */
  onReachBottom: function () {},
  methods: {
    getOrderDetail: function (orderNo) {
      let that = this;
      let getParams = {};
      getParams.orderNo = orderNo;
      let customIndex = getApp().globalData.AddClientUrl("/get_manager_mendian_order_detail_admin_mendian_json.html", getParams, 'post'); // wx.showLoading({
      //   title: 'loading'
      // })

      getApp().globalData.showToastLoading('loading', true);
      wx.request({
        url: customIndex.url,
        data: customIndex.params,
        header: getApp().globalData.headerPost,
        method: 'POST',
        success: function (res) {
          console.log('-----------orderDetail--------');
          console.log(res.data);

          if (res.data.errcode == 0) {
            that.setData({
              orderDetailData: res.data.relateObj
            });
          }

          wx.hideLoading();
        },
        fail: function (res) {
          wx.hideLoading();
          getApp().globalData.loadFail();
        }
      });
    },
    //物流单号 一键复制的事件
    copyTBL: function () {
      var that = this;
      wx.setClipboardData({
        data: that.orderDetailData.invoiceNo,
        success: function (res) {
          wx.getClipboardData({
            success: function (res) {
              wx.showToast({
                title: '复制成功',
                icon: 'success',
                duration: 2000
              });
            }
          });
        }
      });
    },
    setData: function (obj) {
      let that = this;
      let keys = [];
      let val, data;
      Object.keys(obj).forEach(function (key) {
        keys = key.split('.');
        val = obj[key];
        data = that.$data;
        keys.forEach(function (key2, index) {
          if (index + 1 == keys.length) {
            that.$set(data, key2, val);
          } else {
            if (!data[key2]) {
              that.$set(data, key2, {});
            }
          }

          data = data[key2];
        });
      });
    }
  }
};
</script>
<style>
@import "./index.css";
</style>